<template>
  <div>

    <read-card-header ref='cardHeader' @transfer='getCardHeader' @clearData='handleRefresh'></read-card-header>
    <a-card class='card' title='病人基本信息' :bordered='false' :loading='this.showLoading'>
      <a-form-model @submit='handleSubmit' ref='form' :model='model' :rules='validatorRules'
                    @validate='handleValidate'>
        <a-row>
          <a-col :lg='6' :md='12' :sm='24' :offset='1'>
            <a-form-model-item label='姓名' :labelCol='{lg: {span:5}}' :wrapperCol='{lg:{span:19}}' prop='patientName'>
              <a-input v-model='model.patientName'
                       placeholder='请输入姓名'
              />
            </a-form-model-item>
          </a-col>
          <a-col :lg='6' :md='12' :sm='24' :offset='1'>
            <a-form-model-item :labelCol='{lg: {span:9}}' :wrapperCol='{lg:{span:15}}'
                               label='证件类型' prop='certificateType'>
              <a-select placeholder='请选择证件类型' v-model='model.certificateType'>
                <a-select-option value='身份证'>身份证</a-select-option>
                <a-select-option value='护照'>护照</a-select-option>
                <a-select-option value='港澳通行证'>港澳通行证</a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>
          <a-col :lg='6' :md='12' :sm='24' :offset='1'>
            <a-form-model-item label='证件号' :labelCol='{lg: {span:6}}' :wrapperCol='{lg:{span:18}}' prop='certificateId'>
              <a-input v-model='model.certificateId'
                       placeholder='请输入证件号'
              />
            </a-form-model-item>
          </a-col>
          <a-col :lg='6' :md='12' :sm='24' :offset='1'>
            <a-form-model-item label='性别' :labelCol='{lg: {span:6}}' :wrapperCol='{lg:{span:18}}' prop='sex'>
              <a-radio-group v-model='model.sex' name='sex'>
                <a-radio value='1'>男</a-radio>
                <a-radio value='2'>女</a-radio>
              </a-radio-group>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :lg='7' :md='12' :sm='24' :offset='1'>
            <a-form-model-item label='出生日期' :labelCol='{lg: {span:7}}' :wrapperCol='{lg:{span:17}}' prop='birthDate'>
              <j-date placeholder='请选择出生日期' v-model='model.birthDate' style='width: 100%' />
            </a-form-model-item>
          </a-col>
          <a-col :lg='6' :md='12' :sm='24' :offset='1'>
            <a-form-model-item label='年龄' :labelCol='{lg: {span:5}}' :wrapperCol='{lg:{span:19}}' prop='age'>
              <a-input-number v-model='model.age' placeholder='请输入年龄' style='width: 100%' />
            </a-form-model-item>
          </a-col>
          <a-col :lg='6' :md='12' :sm='24' :offset='1'>
            <a-form-model-item label='手机号' :labelCol='{lg: {span:6}}' :wrapperCol='{lg:{span:18}}' prop='phone'>
              <a-input v-model='model.phone' placeholder='请输入手机号' />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :lg='6' :md='12' :sm='24' :offset='1'>
            <a-form-model-item label='现住址' :labelCol='{lg: {span:6}}' :wrapperCol='{lg:{span:18}}'
                               prop='nowAddressRegion'>
              <j-area-linkage type='cascader' v-model='model.nowAddressRegion' placeholder='请输入省市区' />
            </a-form-model-item>
          </a-col>
          <a-col :lg='12' :md='12' :sm='24' :offset='1'>
            <a-form-model-item label='详细地址' :labelCol='{lg: {span:5}}' :wrapperCol='{lg:{span:19}}'
                               prop='nowAddressDetail'>
              <a-input v-model='model.nowAddressDetail' placeholder='请输入详细地址' />
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </a-card>

    <footer-tool-bar>
      <a-space :size='15'>
        <a-button type='primary' @click='handleSubmit'>
          提交
        </a-button>
        <a-button type='primary' @click='handleRefresh'>刷新</a-button>
      </a-space>
    </footer-tool-bar>
  </div>

</template>

<script>
import ReadCardHeader from '../../../components/zoe/ReadCardHeader'
import FooterToolBar from '../../../components/tools/FooterToolBar'
import { postAction, getAction } from '../../../api/manage'

export default {
  name: 'PatientRegister',
  components: {
    ReadCardHeader,
    FooterToolBar
  },
  data() {
    return {
      cardInfo: {},
      showLoading: false,
      model: {
        patientName: '',
        certificateType: '',
        certificateId: '',
        sex: '',
        birthDate: '',
        age: '',
        phone: '',
        nowAddressRegion: '',
        nowAddressDetail: ''
      },
      validatorRules: {
        sex: [
          { required: true, message: '请输入性别!' }
        ],
        phone: [
          { required: false },
          { pattern: /^1[3456789]\d{9}$/, message: '请输入正确的手机号码!' }
        ]
      }
    }
  },
  methods: {
    getCardHeader(data) {
      this.showLoading=true
      this.cardInfo = data.card
      this.model = data.patient
      setTimeout(() => {
        this.showLoading = false
      }, 200)
    },
    handleSubmit() {
      if (this.$refs.cardHeader.model.cardNumber === '') {
        this.$message.warn('卡号不可为空')
        return false
      }
      this.$refs.form.validate(valid => {
        if (valid){
          postAction('/patient/patBasicInfo/register', {
            cardInfo: this.$refs.cardHeader.model,
            basicInfo: this.model
          }).then((res) => {
            if (res.success) {
              this.$message.success(res.message)
              this.handleRefresh()
            } else {
              this.$message.warn(res.message)
            }
          })
        }
      })
    },
    handleValidate(...args) {
      console.log('触发校验', args)
    },
    handleRefresh() {
      this.showLoading = true
      let cardNumber = sessionStorage.getItem('cardNumber')
      if (cardNumber !== 'null' && cardNumber !== null && cardNumber !== '') {
        getAction('/charge/comCardInfo/' + this.$refs.cardHeader.model.cardNumber, { keywords: 'card_patient' })
          .then((res) => {
            if (res.success) {

              this.model = res.result.patient
              console.log('刷新数据', this.model)
            }
          })
      } else {
        // this.$refs.form.resetFields()
        this.model={}
        console.log("170",this.model)
      }
      setTimeout(() => {
        this.showLoading = false
      }, 200)
    }
  }
}
</script>

<style scoped>

</style>